<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p>账号：
        <input type="text" class="loginId">
    </p>
    <p>密码：
        <input type="text" class="loginPwd">
    </p>
    <button>登录</button>
    <script>
        const id = document.querySelector('.loginId');
        const pwd = document.querySelector('.loginPwd');
        const btn = document.querySelector('button');

        btn.onclick = async () => {
            // console.log(id.value,pwd.value);
            const send = {
                method:'POST',
                headers:{
                    'Content-Type': 'application/json',
                },
                body: JSON.stringify({
                    loginId:id.value,
                    loginPwd:pwd.value
                }),
            }
            const url = 'https://study.duyiedu.com/api/user/login';
            const body = await (await fetch(url,send)).json();
            if(body.code){
                alert(body.msg);
            }
            else {
                alert('Login Success!')
            }
            // console.log(body.data.id);
        }


        // let xhr = new XMLHttpRequest();
        // xhr.onreadystatechange = function() {
        //     console.log(xhr.readyState);
        //     if(xhr.readyState === 4){
        //         console.log('Finished loading');
        //         console.log(JSON.parse(xhr.responseText));
        //     }
        // };
        // xhr.open('GET','https://study.duyiedu.com/api/herolist');
        // xhr.setRequestHeader('Content-Type', 'application/json');
        // xhr.send(null);

        // fetch('https://study.duyiedu.com/api/herolist').then(resp=>{
        //     resp.json().then(json=>console.log(json));
        // })

        // async function getHeroes(){
        //     const resp = await fetch('https://study.duyiedu.com/api/herolist');
        //     return await resp.json();
        // }
        
        // getHeroes().then(resp=>{
        //     console.log(resp);
        // });
    </script>
</body>
</html>